<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>售后订单</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="../../../component/elementUI/index.css">
    <link rel="stylesheet" href="../../../style/wangeditor.css">
    <link rel="stylesheet" href="../../../style/index.css">
    <style>
        .custom-tree-node {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 14px;
            padding-right: 8px;
        }

        .custom-tree-node .config {
            padding: 10px 0 10px 8px;
            /* border-left: 1px solid #EBEEF5; */
        }

        .el-tree-node__content {
            padding: 10px 0 10px;
            /* border-bottom: 1px solid #EBEEF5; */
        }

        .el-dialog__header {
            padding: 15px 15px 10px;
        }

        .el-dialog__body {
            padding: 15px;
        }

        .el-dialog__footer {
            padding: 5px 15px 10px;
        }

        .cont-scroll-wrap {
            border: 1px solid #EBEEF5;
            flex: auto;
            height: 0;
            overflow-y: auto;
        }

        .el-descriptions-item__label {
            width: 100px;
        }

        #order .el-dialog{
            margin-top:10px!important;
            margin: 0 auto 10px;
        }

        #order .el-dialog__header {
            padding: 15px 15px 0;
        }

        #order .el-dialog__body {
            padding: 0 15px 0;
        }
        
        #order .el-input.is-disabled .el-input__inner {
            color: #000;
            background-color: #fff;
        }

        #show .el-input.is-disabled .el-input__inner {
            color: #000;
            background-color: #fff;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <el-form :inline="true" :form="form">
            <el-form-item>
                <el-input v-model.trim="form.Sales_Order_SerialNumber" clearable placeholder="售后单号/所属订单号" />
            </el-form-item>
            <el-form-item>
                <el-select v-model.trim="form.Supplier_SerialNumber" clearable style="width: 100%;"
                    placeholder="请选择供应商">
                    <el-option v-for="item in Supplier" :key="item.Supplier_SerialNumber" :label="item.Supplier_Name"
                        :value="item.Supplier_SerialNumber"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-date-picker prefix-icon="el-icon-date" v-model="form.Submit_Date" clearable type="datetimerange"
                    value-format="yyyy-MM-dd HH:mm:ss" :default-time="['00:00:00', '23:59:59']" format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期"
                    end-placeholder="结束日期"></el-date-picker>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSerach">查询</el-button>
            </el-form-item>
            <el-form-item>
                <yl-button type="success" :data="ExportData" :loading="loading" @click="Export(form)">售后订单导出</yl-button>
            </el-form-item>
        </el-form>
        <el-table v-if="table" :data="tableData" stripe border height="calc(100vh - 140px)" style="width: 100%">
            <el-table-column align="center" fixed="left" type="index" label="序号" width="50"></el-table-column>
            <el-table-column align="center" fixed="left" width="160" label="操作">
                <template v-slot="{row}">
                    <!-- <el-dropdown v-if="row.Refund_Type.charAt(1)=='0'&&row.Row_Status.charAt(1)!='3'&&row.Row_Status.charAt(1)!='4'" trigger="click" @command="downloadTemplate($event,row)">
                        <el-button type="primary" size="small">处理</el-button>
                        <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item command="true">同意</el-dropdown-item>
                            <el-dropdown-item command="false">拒绝</el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown> -->
                    <el-button v-if="row.Row_Status.charAt(1)!='2'&&row.Row_Status.charAt(1)!='1'&&row.Row_Status.charAt(1)!='3'&&row.Row_Status.charAt(1)!='4'&&row.Row_Status.charAt(1)!='6'" @click="downloadTemplate('show',row)" type="primary" size="small">处理</el-button>
                    <el-button @click="downloadTemplate('return',row)" v-else-if="row.Row_Status.charAt(1)=='4'" type="success" size="small">确认已退货</el-button>
                    <el-button v-else type="primary" @click="downloadTemplate('show',row)" size="small">查看</el-button>
                </template>
            </el-table-column>
            <el-table-column align="center" fixed="left" show-overflow-tooltip prop="Refund_SerialNumber" width="150" label="售后单号"></el-table-column>
            <el-table-column align="center" fixed="left" show-overflow-tooltip prop="Sales_Order_SerialNumber" width="250" label="订单单号"></el-table-column>
            <el-table-column align="center" show-overflow-tooltip width="100" prop="Supplier_Name"  label="供应商"></el-table-column>
            <el-table-column align="center" show-overflow-tooltip width="100" prop="Article_Name"  label="商品名称"></el-table-column>
            <el-table-column align="center" show-overflow-tooltip prop=""  label="售后类型">
                <template v-slot="{row}">
                    {{row.Row_Status.charAt(0)=='0'?'仅退款':row.Row_Status.charAt(0)=='1'?'退货退款':row.Row_Status.charAt(0)=='2'?'换货':''}}
                </template>
            </el-table-column>
            <el-table-column align="center" show-overflow-tooltip prop="Quantity" width="150" label="下单数量"></el-table-column>
            <el-table-column align="center" show-overflow-tooltip prop="Refund_Quantity" width="150" label="退款数量"></el-table-column>
            <el-table-column align="center" show-overflow-tooltip prop="Refund_Cause" width="150" label="退款原因"></el-table-column>
            <el-table-column align="center" show-overflow-tooltip width="150" label="退款金额">
                <template v-slot="{row}">
                    {{Amount(row)}}
                </template>
            </el-table-column>
            <el-table-column align="center" width="150" show-overflow-tooltip   label="拒绝退款原因">
                <template v-slot="{row}">
                    {{row.Cause}}
                </template>
            </el-table-column>
            <el-table-column align="center" width="150" show-overflow-tooltip   label="退货物流单号">
                <template v-slot="{row}">
                    <span  style="cursor: pointer;" @click="showLogistics(row.Logistics_Number)">{{row.Logistics_Number}}</span>
                </template>
            </el-table-column>
            <el-table-column align="center" width="150" show-overflow-tooltip   label="换货物流单号">
                <template v-slot="{row}">
                    <span  style="cursor: pointer;" @click="showLogistics(row.Logistics_Number1)">{{row.Logistics_Number1}}</span>
                </template>
            </el-table-column>
            <el-table-column fixed="right" align="center" show-overflow-tooltip prop="Submit_Date" width="180" label="申请时间">
                <template v-slot="{row}">
                    {{getYMDHMSDate(row.Submit_Date)}}
                </template>
            </el-table-column>
            <el-table-column fixed="right" align="center" width="150" show-overflow-tooltip   label="售后状态">
                <template v-slot="{row}">
                    {{Row_Status(row.Row_Status)}}
                </template>
            </el-table-column>
        </el-table>
        <el-pagination style="margin-top: 5px;" background @size-change="handleSizeChange"
            @current-change="handleCurrentChange" :current-page="form.page" :page-sizes="[20, 30, 50]"
            :page-size="form.limit" layout="total, sizes, prev, pager, next, jumper" :total="total">
        </el-pagination>
        <!-- <show-detail :visible.sync="dialogVisible" :data="Sales_Order"></show-detail> -->
        <show-detail1 :visible.sync="dialogVisible" @callback="callback" :data="Sales_Order"></show-detail1>
    </div>
    <script type="text/javascript" src="../../../utils/wangeditor.js"></script>
    <script type="text/javascript" src="../../../utils/jquery.min.js"></script>
    <script type="text/javascript" src="../../../utils/jquery.cookie.js"></script>
    <script type="text/javascript" src="../../../utils/vue.min.js"></script>
    <script type="text/javascript" src="../../../utils/vuex.min.js"></script>
    <script type="text/javascript" src="../../../component/elementUI/index.js"></script>
    <script type="text/javascript" src="../../../component/component.js"></script>
    <script type="text/javascript" src="../../../utils/FileSaver.min.js"></script>
    <script type="text/javascript" src="../../../utils/FileSaver.js"></script>
    <script type="text/javascript" src="../../../utils/xlsx.full.min.js"></script>
    <script type="text/javascript" src="../../../utils/xlsx.core.min.js"></script>
    <script type="text/javascript" src="../../../config/config.js"></script>
    <script type="text/javascript" src="../../../utils/compressor.js"></script>
    <script type="text/javascript" src="../../../utils/ID_Validity.js"></script>
    <script type="text/javascript" src="../../../utils/utils.js"></script>
    <script type="text/javascript" src="../index.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
</body>

</html>